<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>添加文章 - 管理后台</title>
    <link rel="stylesheet" href="/static/css/layui.css" media="all">
    <link rel="stylesheet" href="/static/css/public.css?s=0.01" media="all" />
</head>
<body class="childrenBody">
<form class="layui-form " action="" method="post">
    <div class="layui-col-md12 layui-col-space10">
        <div class="layui-col-md7 layui-col-xs12">
            <blockquote class="layui-elem-quote title"><i class="seraph icon-caidan"></i> 基本信息</blockquote>
            <div class="border">
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:120px;">分类</label>
                    <div class="layui-input-inline">
                        <select name="category_id" lay-verify="required">
                            <option value="" >选择所属分类</option>
                            {volist name="category" id="val"}
                            <option value="{$val['category_id']}" >{$val['name']}</option>
                            {/volist}
                        </select>
                    </div>
                    <div class="layui-form-mid layui-word-aux">必填</div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:120px;">标题</label>
                    <div class="layui-input-inline">
                        <input name="title" value="" placeholder="" lay-verify="required" class="layui-input" type="text">
                    </div>
                    <div class="layui-form-mid layui-word-aux">必填</div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:120px;">图片</label>
                    <div class="layui-input-inline">
                        <button class="layui-btn" id="image_bnt" type="button">选择图片</button>
                        <input name="article_image" type="hidden" value="" id="cs_image">
                    </div>
                    <div class="layui-form-mid layui-word-aux">建议尺寸：750px*360px</div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:120px;">讲师</label>
                    <div class="layui-input-inline">
                        <select name="teacher_id">
                            <option value="" >选择讲师</option>
                            {volist name="teacher" id="val"}
                            <option value="{$val['teacher_id']}" >{$val['name']}</option>
                            {/volist}
                        </select>
                    </div>
                    <div class="layui-form-mid layui-word-aux">必填</div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:120px;">文章时间</label>
                    <div class="layui-input-inline">
                        <input name="start_time" id="start_time" value="" placeholder="" class="layui-input" type="text">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:120px;">排序</label>
                    <div class="layui-input-inline">
                        <input name="sort" value="99" placeholder="" class="layui-input" type="text">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label" style="width:120px;">简介</label>
                    <div class="layui-input-block" style="margin-left: 150px;">
                        <textarea name="description" class="layui-textarea" type="text" rows="10"></textarea>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-col-md5 layui-col-xs12">
            <blockquote class="layui-elem-quote title"><i class="seraph icon-caidan"></i> 文章详情</blockquote>
            <div class="border">
                <div class="layui-row layui-col-space10" style="width:360px;margin:auto">
                    <textarea name="content" id="content" lay-verify="content" class="layui-textarea" type="text" rows="10"></textarea>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">&nbsp;</label>
            <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="demo1">提交保存</button>
        </div>
    </div>
</form>
<script src="/static/layui.js"></script>
<script>
    var $;
    layui.use(['element','jquery','upload','layer','form','layedit','laydate'], function(){
        var element = layui.element,layer = layui.layer,form = layui.form,upload = layui.upload,layedit = layui.layedit,laydate = layui.laydate;
        $ = layui.$;
        var edit_index;
        form.verify({
            content: function(value) {
                return layedit.sync(edit_index);
            }
        });
        form.on('submit(demo1)', function(data){
            var index = layer.load(1);
            $.post('{:url("article/addArticle")}',data.field,function (data) {
                if(data.code == 0){
                    layer.close(index);
                    layer.msg(data.msg,{
                        time: 3000,
                        icon:1
                    }, function(){
                        parent.layer.closeAll("iframe");
                        parent.layui.tableIns.reload();
                    });
                }else{
                    layer.close(index);
                    layer.msg(data.msg,{icon:5,shift:6});
                }
            });
            return false;
        });
        edit_index = layedit.build('content',{
            height: 400,
            hideTool: ['link','unlink','face'],
            uploadVideo:{
                url: '{:url("system/editUpload")}',
                type: 'post',
            },
            uploadImage:{
                url: '{:url("system/editUpload")}',
                type: 'post',
            }
        });
        $('.childrenBody').on('click','img',function(){
            var img = new Array;
            img.push({src:$(this).attr('src')});
            layer.photos({
                photos: {data:img},
                anim: 5
            });
        });
        laydate.render({
            elem: '#start_time',
            type: 'date'
        });
        upload.render({
            elem: '#image_bnt',
            url: '{:url("system/upload")}',
            field: 'image',
            accept:'images',
            acceptMime :'images',
            before: function(){
                layer.load();
            },
            done: function(res){
                layer.closeAll('loading');
                if(res.code == 0){
                    $('#image_bnt').prevAll().remove();
                    $('#image_bnt').before('<img src="/'+res.data+'" title="+res.title+" style="height:40px;">&nbsp;');
                    $('#cs_image').val(res.data);
                }else{
                    layer.msg(res.msg,{icon:5,shift:6});
                }
            },
            error: function(){
                layer.closeAll('loading');
                layer.msg('上传失败',{icon:5,shift:6});
            }
        });
    });
</script>
</body>
</html>